// 初始化所有图表
document.addEventListener('DOMContentLoaded', function() {
    // 数字动画效果
    animateValue("plantingArea", 0, 1250, 1500);
    animateValue("irrigationTimes", 0, 48, 1500);
    animateValue("weedingArea", 0, 980, 1500);
    animateValue("pestControl", 0, 32, 1500);
    animateValue("harvestYield", 0, 560, 1500);

    // 初始化图表
    initPlantingChart();
    initIrrigationChart();
    initWeedingChart();
    initPestChart();
    initHarvestChart();

    // 窗口大小变化时重新调整图表大小
    window.addEventListener('resize', function() {
        plantingChart.resize();
        irrigationChart.resize();
        weedingChart.resize();
        pestChart.resize();
        harvestChart.resize();
    });
});

// 数字增长动画
function animateValue(id, start, end, duration) {
    const obj = document.getElementById(id);
    let startTimestamp = null;
    const step = (timestamp) => {
        if (!startTimestamp) startTimestamp = timestamp;
        const progress = Math.min((timestamp - startTimestamp) / duration, 1);
        obj.innerHTML = Math.floor(progress * (end - start) + start);
        if (progress < 1) {
            window.requestAnimationFrame(step);
        }
    };
    window.requestAnimationFrame(step);
}

// 种植阶段图表
function initPlantingChart() {
    const chartDom = document.getElementById('plantingChart');
    plantingChart = echarts.init(chartDom);

    const option = {
        backgroundColor: 'transparent',
        tooltip: {
            trigger: 'axis',
            axisPointer: { type: 'shadow' },
            backgroundColor: 'rgba(0,0,0,0.8)',
            borderColor: '#00ffff',
            borderWidth: 1,
            textStyle: { color: '#fff' }
        },
        legend: {
            data: ['小麦', '玉米', '水稻', '大豆'],
            textStyle: { color: '#ccc' },
            right: 10,
            top: 0
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            data: ['3月', '4月', '5月', '6月', '7月', '8月'],
            axisLine: { lineStyle: { color: '#4a4a4a' } },
            axisLabel: {
                color: '#999',
                rotate: 45
            }
        },
        yAxis: {
            type: 'value',
            name: '面积(亩)',
            nameTextStyle: { color: '#999' },
            splitLine: { lineStyle: { color: 'rgba(100,100,100,0.3)' } },
            axisLine: { show: false },
            axisLabel: { color: '#999' }
        },
        series: [
            {
                name: '小麦',
                type: 'bar',
                stack: 'total',
                emphasis: {
                    focus: 'series',
                    itemStyle: {
                        color: '#00ffff',
                        shadowBlur: 10,
                        shadowColor: '#00ffff'
                    }
                },
                data: [320, 332, 301, 334, 390, 120],
                itemStyle: {
                    color: '#00ffff',
                    borderRadius: [4, 4, 0, 0]
                }
            },
            {
                name: '玉米',
                type: 'bar',
                stack: 'total',
                emphasis: {
                    focus: 'series',
                    itemStyle: {
                        color: '#0088ff',
                        shadowBlur: 10,
                        shadowColor: '#0088ff'
                    }
                },
                data: [120, 132, 101, 134, 90, 230],
                itemStyle: {
                    color: '#0088ff',
                    borderRadius: [4, 4, 0, 0]
                }
            },
            {
                name: '水稻',
                type: 'bar',
                stack: 'total',
                emphasis: {
                    focus: 'series',
                    itemStyle: {
                        color: '#00ff88',
                        shadowBlur: 10,
                        shadowColor: '#00ff88'
                    }
                },
                data: [220, 182, 191, 234, 290, 330],
                itemStyle: {
                    color: '#00ff88',
                    borderRadius: [4, 4, 0, 0]
                }
            },
            {
                name: '大豆',
                type: 'bar',
                stack: 'total',
                emphasis: {
                    focus: 'series',
                    itemStyle: {
                        color: '#ff00ff',
                        shadowBlur: 10,
                        shadowColor: '#ff00ff'
                    }
                },
                data: [150, 232, 201, 154, 190, 330],
                itemStyle: {
                    color: '#ff00ff',
                    borderRadius: [4, 4, 0, 0]
                }
            }
        ]
    };

    plantingChart.setOption(option);
}

// 浇灌阶段图表
function initIrrigationChart() {
    const chartDom = document.getElementById('irrigationChart');
    irrigationChart = echarts.init(chartDom);

    const option = {
        backgroundColor: 'transparent',
        tooltip: {
            trigger: 'axis',
            axisPointer: { type: 'cross', label: { backgroundColor: '#6a7985' } },
            backgroundColor: 'rgba(0,0,0,0.8)',
            borderColor: '#00ffff',
            borderWidth: 1,
            textStyle: { color: '#fff' }
        },
        legend: {
            data: ['滴灌', '喷灌', '漫灌', '需水量'],
            textStyle: { color: '#ccc' },
            right: 10,
            top: 0
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        xAxis: [
            {
                type: 'category',
                boundaryGap: false,
                data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月'],
                axisLine: { lineStyle: { color: '#4a4a4a' } },
                axisLabel: {
                    color: '#999',
                    rotate: 45
                }
            }
        ],
        yAxis: [
            {
                type: 'value',
                name: '水量(m³)',
                position: 'left',
                nameTextStyle: { color: '#999' },
                splitLine: { lineStyle: { color: 'rgba(100,100,100,0.3)' } },
                axisLine: { show: false },
                axisLabel: { color: '#999' }
            }
        ],
        series: [
            {
                name: '滴灌',
                type: 'line',
                stack: '总量',
                areaStyle: {
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                        { offset: 0, color: 'rgba(0, 255, 255, 0.5)' },
                        { offset: 1, color: 'rgba(0, 255, 255, 0.1)' }
                    ])
                },
                emphasis: {
                    focus: 'series',
                    lineStyle: { width: 4 }
                },
                data: [120, 132, 101, 134, 90, 230, 210],
                symbol: 'circle',
                symbolSize: 6,
                lineStyle: {
                    width: 3,
                    color: '#00ffff'
                },
                itemStyle: {
                    color: '#00ffff',
                    borderColor: '#fff',
                    borderWidth: 1
                }
            },
            {
                name: '喷灌',
                type: 'line',
                stack: '总量',
                areaStyle: {
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                        { offset: 0, color: 'rgba(0, 136, 255, 0.5)' },
                        { offset: 1, color: 'rgba(0, 136, 255, 0.1)' }
                    ])
                },
                emphasis: {
                    focus: 'series',
                    lineStyle: { width: 4 }
                },
                data: [220, 182, 191, 234, 290, 330, 310],
                symbol: 'circle',
                symbolSize: 6,
                lineStyle: {
                    width: 3,
                    color: '#0088ff'
                },
                itemStyle: {
                    color: '#0088ff',
                    borderColor: '#fff',
                    borderWidth: 1
                }
            },
            {
                name: '漫灌',
                type: 'line',
                stack: '总量',
                areaStyle: {
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                        { offset: 0, color: 'rgba(255, 0, 255, 0.5)' },
                        { offset: 1, color: 'rgba(255, 0, 255, 0.1)' }
                    ])
                },
                emphasis: {
                    focus: 'series',
                    lineStyle: { width: 4 }
                },
                data: [150, 232, 201, 154, 190, 330, 410],
                symbol: 'circle',
                symbolSize: 6,
                lineStyle: {
                    width: 3,
                    color: '#ff00ff'
                },
                itemStyle: {
                    color: '#ff00ff',
                    borderColor: '#fff',
                    borderWidth: 1
                }
            },
            {
                name: '需水量',
                type: 'line',
                symbol: 'circle',
                symbolSize: 8,
                lineStyle: {
                    width: 3,
                    type: 'dashed',
                    color: '#ff5555'
                },
                itemStyle: {
                    color: '#ff5555',
                    borderColor: '#fff',
                    borderWidth: 1
                },
                emphasis: {
                    itemStyle: {
                        color: '#ff0000',
                        shadowBlur: 10,
                        shadowColor: '#ff0000'
                    }
                },
                data: [420, 532, 501, 534, 630, 730, 710]
            }
        ]
    };

    irrigationChart.setOption(option);
}

// 除草阶段图表
function initWeedingChart() {
    const chartDom = document.getElementById('weedingChart');
    weedingChart = echarts.init(chartDom);

    const option = {
        backgroundColor: 'transparent',
        tooltip: {
            trigger: 'item',
            backgroundColor: 'rgba(0,0,0,0.8)',
            borderColor: '#00ffff',
            borderWidth: 1,
            textStyle: { color: '#fff' }
        },
        legend: {
            top: '5%',
            left: 'center',
            textStyle: { color: '#ccc' }
        },
        series: [
            {
                name: '除草方式',
                type: 'pie',
                radius: ['40%', '70%'],
                avoidLabelOverlap: false,
                itemStyle: {
                    borderRadius: 10,
                    borderColor: '#1a1a1a',
                    borderWidth: 2
                },
                label: {
                    show: false,
                    position: 'center',
                    color: '#fff'
                },
                emphasis: {
                    scale: true,
                    scaleSize: 10,
                    label: {
                        show: true,
                        fontSize: '18',
                        fontWeight: 'bold',
                        color: '#fff'
                    }
                },
                labelLine: {
                    show: false
                },
                data: [
                    {
                        value: 35,
                        name: '机械除草',
                        itemStyle: {
                            color: '#00ffff',
                            shadowBlur: 10,
                            shadowColor: 'rgba(0, 255, 255, 0.5)'
                        }
                    },
                    {
                        value: 25,
                        name: '人工除草',
                        itemStyle: {
                            color: '#0088ff',
                            shadowBlur: 10,
                            shadowColor: 'rgba(0, 136, 255, 0.5)'
                        }
                    },
                    {
                        value: 20,
                        name: '化学除草',
                        itemStyle: {
                            color: '#ff00ff',
                            shadowBlur: 10,
                            shadowColor: 'rgba(255, 0, 255, 0.5)'
                        }
                    },
                    {
                        value: 15,
                        name: '生物除草',
                        itemStyle: {
                            color: '#00ff88',
                            shadowBlur: 10,
                            shadowColor: 'rgba(0, 255, 136, 0.5)'
                        }
                    },
                    {
                        value: 5,
                        name: '其他方式',
                        itemStyle: {
                            color: '#ff5555',
                            shadowBlur: 10,
                            shadowColor: 'rgba(255, 85, 85, 0.5)'
                        }
                    }
                ]
            }
        ]
    };

    weedingChart.setOption(option);
}

// 病虫害防治图表
function initPestChart() {
    const chartDom = document.getElementById('pestChart');
    pestChart = echarts.init(chartDom);

    const option = {
        backgroundColor: 'transparent',
        tooltip: {
            trigger: 'axis',
            axisPointer: { type: 'shadow' },
            backgroundColor: 'rgba(0,0,0,0.8)',
            borderColor: '#00ffff',
            borderWidth: 1,
            textStyle: { color: '#fff' }
        },
        radar: {
            radius: '65%',
            splitNumber: 4,
            axisName: {
                color: '#999'
            },
            splitLine: {
                lineStyle: {
                    color: 'rgba(100,100,100,0.3)'
                }
            },
            splitArea: {
                show: false
            },
            axisLine: {
                lineStyle: {
                    color: 'rgba(100,100,100,0.3)'
                }
            },
            indicator: [
                { name: '蚜虫', max: 100 },
                { name: '螟虫', max: 100 },
                { name: '稻飞虱', max: 100 },
                { name: '纹枯病', max: 100 },
                { name: '白粉病', max: 100 },
                { name: '锈病', max: 100 }
            ]
        },
        series: [
            {
                name: '病虫害防治效果',
                type: 'radar',
                emphasis: {
                    lineStyle: {
                        width: 4
                    }
                },
                data: [
                    {
                        value: [85, 90, 78, 92, 88, 76],
                        name: '防治效果',
                        symbol: 'circle',
                        symbolSize: 8,
                        areaStyle: {
                            color: 'rgba(0, 255, 255, 0.4)'
                        },
                        lineStyle: {
                            width: 3,
                            color: 'rgba(0, 255, 255, 1)'
                        },
                        itemStyle: {
                            color: 'rgba(0, 255, 255, 1)',
                            borderColor: '#fff',
                            borderWidth: 1
                        }
                    },
                    {
                        value: [65, 70, 58, 72, 68, 56],
                        name: '发生频率',
                        symbol: 'circle',
                        symbolSize: 8,
                        areaStyle: {
                            color: 'rgba(255, 0, 255, 0.4)'
                        },
                        lineStyle: {
                            width: 3,
                            color: 'rgba(255, 0, 255, 1)'
                        },
                        itemStyle: {
                            color: 'rgba(255, 0, 255, 1)',
                            borderColor: '#fff',
                            borderWidth: 1
                        }
                    }
                ]
            }
        ]
    };

    pestChart.setOption(option);
}

// 收获阶段图表
function initHarvestChart() {
    const chartDom = document.getElementById('harvestChart');
    harvestChart = echarts.init(chartDom);

    const option = {
        backgroundColor: 'transparent',
        tooltip: {
            trigger: 'axis',
            axisPointer: { type: 'cross', label: { backgroundColor: '#6a7985' } },
            backgroundColor: 'rgba(0,0,0,0.8)',
            borderColor: '#00ffff',
            borderWidth: 1,
            textStyle: { color: '#fff' }
        },
        legend: {
            data: ['小麦', '玉米', '水稻', '大豆', '平均产量'],
            textStyle: { color: '#ccc' },
            right: 10,
            top: 0
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            boundaryGap: false,
            data: ['2018', '2019', '2020', '2021', '2022', '2023', '2024'],
            axisLine: { lineStyle: { color: '#4a4a4a' } },
            axisLabel: {
                color: '#999',
                rotate: 45
            }
        },
        yAxis: {
            type: 'value',
            name: '产量(吨)',
            nameTextStyle: { color: '#999' },
            splitLine: { lineStyle: { color: 'rgba(100,100,100,0.3)' } },
            axisLine: { show: false },
            axisLabel: { color: '#999' }
        },
        series: [
            {
                name: '小麦',
                type: 'line',
                stack: '总量',
                smooth: true,
                lineStyle: { width: 0 },
                showSymbol: false,
                areaStyle: {
                    opacity: 0.8,
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                        { offset: 0, color: 'rgba(0, 255, 255, 0.6)' },
                        { offset: 1, color: 'rgba(0, 255, 255, 0.1)' }
                    ])
                },
                emphasis: { focus: 'series' },
                data: [140, 152, 161, 174, 190, 210, 225]
            },
            {
                name: '玉米',
                type: 'line',
                stack: '总量',
                smooth: true,
                lineStyle: { width: 0 },
                showSymbol: false,
                areaStyle: {
                    opacity: 0.8,
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                        { offset: 0, color: 'rgba(0, 136, 255, 0.6)' },
                        { offset: 1, color: 'rgba(0, 136, 255, 0.1)' }
                    ])
                },
                emphasis: { focus: 'series' },
                data: [120, 132, 101, 134, 190, 230, 210]
            },
            {
                name: '水稻',
                type: 'line',
                stack: '总量',
                smooth: true,
                lineStyle: { width: 0 },
                showSymbol: false,
                areaStyle: {
                    opacity: 0.8,
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                        { offset: 0, color: 'rgba(0, 255, 136, 0.6)' },
                        { offset: 1, color: 'rgba(0, 255, 136, 0.1)' }
                    ])
                },
                emphasis: { focus: 'series' },
                data: [220, 182, 191, 234, 290, 330, 310]
            },
            {
                name: '大豆',
                type: 'line',
                stack: '总量',
                smooth: true,
                lineStyle: { width: 0 },
                showSymbol: false,
                areaStyle: {
                    opacity: 0.8,
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                        { offset: 0, color: 'rgba(255, 0, 255, 0.6)' },
                        { offset: 1, color: 'rgba(255, 0, 255, 0.1)' }
                    ])
                },
                emphasis: { focus: 'series' },
                data: [150, 232, 201, 154, 190, 330, 410]
            },
            {
                name: '平均产量',
                type: 'line',
                symbol: 'circle',
                symbolSize: 8,
                lineStyle: {
                    width: 3,
                    type: 'dashed',
                    color: '#ff5555'
                },
                itemStyle: {
                    color: '#ff5555',
                    borderColor: '#fff',
                    borderWidth: 1
                },
                emphasis: {
                    itemStyle: {
                        color: '#ff0000',
                        shadowBlur: 10,
                        shadowColor: '#ff0000'
                    }
                },
                data: [157.5, 174.5, 163.5, 174, 215, 275, 288.75]
            }
        ]
    };

    harvestChart.setOption(option);
}
